<template>

  <el-carousel indicator-position="outside" height="800px">
    <el-carousel-item v-for="ywcs in params">
      <h3 style="text-align: center; margin: 20px">{{ ywcs.name }}</h3>
      <el-row :gutter="10" style="margin: 8px; display: flex; flex-flow: row wrap;">
        <el-col :span="9">
          <el-card style="height: 100%;">
            <div slot="header" class="clearfix">
              <span>产品特点</span>
            </div>
            <ul>
              <template v-for="(item, index) in ywcs.cptd">
                <li>
                  {{ item.title }} <br/>
                  {{ item.info }} <br/><br/>
                </li>
              </template>
            </ul>
          </el-card>
        </el-col>
        <el-col :span="9">
          <el-card class="update-log" style="height: 100%;">
            <div slot="header">
              <span>应用场景</span>
            </div>
            <div class="body">
              <ul>
                <template v-for="(item, index) in ywcs.yycj">
                  <li>
                    {{ item.title }} <br/>
                    {{ item.info }} <br/><br/>
                  </li>
                </template>
              </ul>
            </div>
          </el-card>
        </el-col>
        <el-col :span="6">
          <el-card style="height: 100%;">
            <div slot="header">
              <span>其它</span>
            </div>
            <ul>
              <template v-for="(item, index) in ywcs.qt">
                <li>
                  {{ item.title }} <br/>
                  {{ item.info }} <br/><br/>
                </li>
              </template>
            </ul>
          </el-card>
        </el-col>
      </el-row>

    </el-carousel-item>
  </el-carousel>

</template>

<script>
  import {params} from '../utils/params.js'
  export default {
    name: "Index",
    data() {
      return {
        params: null
      }
    },
    created() {
      this.params = params
    },
    methods: {}
  }
</script>

<style scoped lang="scss">
</style>

